<template>
	<view class="shopIn-wrap page-bg">
		<view class="form-wrap br">
			<view class="form-group">
				<view class="form-group__title">企业名称</view>
				<view class="form-group__con">
					<input class="form-group__from" v-model="businessName" type="text" placeholder="请输入企业名称" placeholder-class="placeholder" />
				</view>
			</view>
			<view class="form-group">
				<view class="form-group__title">企业代码</view>
				<view class="form-group__con">
					<input class="form-group__from" v-model="creditCode" type="text" placeholder="请输入企业代码" placeholder-class="placeholder" />
				</view>
			</view>
			<view class="form-group">
				<view class="form-group__title">选择地址</view>
				<view class="form-group__con form-group__address" name='address' @tap="handleTap('picker3')">
					{{address}}
				</view>
			</view>
			<!-- 地址选择器 -->
			<lb-picker ref="picker3"
			  v-model="value3"
			  mode="multiSelector"
			  :list="list"
			  :level="3"
			  @confirm="handleConfirm"
			  >
			</lb-picker>
			<view class="form-group">
				<view class="form-group__title">详细地址</view>
				<view class="form-group__con">
					<input class="form-group__from " v-model="addressInfo" type="text" placeholder="请输入详细地址" placeholder-class="placeholder" />
				</view>
			</view>
			
			
		</view>
				
		<view class="interval"></view>
		
		<view class="form-wrap br">
			<view class="form-group form-group__text">
				<textarea class="form-group__from" v-model="businessScope" placeholder="请填写经营范围" placeholder-class="placeholder" />
			</view>
			
			<view class="form-group form-group__upload">
				<view class="form-group__title">请上传营业执照</view>
				<view class="form-group__con">
					<view class="upload-item">
						<image class="upload-img" @click="uploadImg" v-if="licenseImg" :src="licenseImg"></image>
						<image class="upload-img" @click="uploadImg" v-else src="../../static/common/icon_04.png"></image>
						<view class="upload-tip">营业执照</view>
					</view>
				</view>
			</view>
		</view>

		<view class="footer-block"></view>
		
		<view class="page-submit" @click="formSubmit">立即申请</view>
		
	</view>
</template>

<script>
	import list from '../../utils/area-data-min.js'
	import  common  from '../../utils/common.js'
	import { api } from '../../utils/api.js'
	export default{
		data() {
			return{
				value3: [],
				list: list,
				
				id: '', // 记录ID
				shopId: '', // 店铺Id
				
				businessName: '', // 企业名称
				creditCode: '', // 企业代码
				licenseImg: '', // 营业执照图片
				businessScope: '', // 经营范围
				businessAddress: '', // 企业地址
				addressInfo: '',
				address: '',
			}
		},
		onLoad(options) {
			this.shopId = options.id || common.defaultId
		},
		methods:{
			link(url) {
				this.$link(url)
			},
			
			handleTap (picker) {
				this.$refs[picker].show()
			},
			
			handleConfirm(res) {
				let item = res.item
				this.address = item[0]['label'] +item[1]['label'] + item[2]['label']
			},
			
			uploadImg(res) {
				common.imgUpload(res => {
					console.log(res)
					this.licenseImg = res
				})
			},
			
			formSubmit() {
				let { shopId, businessName, creditCode, licenseImg, businessScope, 
					businessAddress, addressInfo, address } = this.$data
				if(!businessName) { this.$showToast('请填写企业名称~'); return }
				if(!creditCode) { this.$showToast('请填写企业代码~'); return }
				if(!address) { this.$showToast('请选择企业地址~'); return }
				if(!addressInfo) { this.$showToast('请填写企业详细地址~'); return }
				if(!businessScope) { this.$showToast('请填写企业经营范围~'); return }
				if(!licenseImg) { this.$showToast('请上传营业执照图片~'); return }
				businessAddress = address + '&&' + addressInfo
				// if(!id) { id = common.defaultId }
				api.shopAuth({ shopId, businessName, creditCode, licenseImg, businessScope, 
					businessAddress}, () => {
					this.$showToast('申请企业店铺信息提交成功, 请耐心等待系统审核~')
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						})
					}, 2000)
				})
			}
		}
	}
</script>

<style scoped lang="less">
@import url('../../app.less');
	.shopIn-wrap{
		padding: 20rpx 30rpx;
		box-sizing: border-box;
	}
	.header-bg{
		width: 100%;
		height: 300upx;
		display: block;
	}
	
	.user-agreel{
		padding: 50upx 20upx ;
		box-sizing: border-box;
		.flex-base;
		justify-content: flex-start;
		.agreel-icon{
			width: 30upx;
			height: 30upx;
		}
		.agreel-title{
			.f22;
			margin-left: 10upx;
		}
		.agreel-con{
			color: @font-orange-color;
		}
	}
	
</style>
